/* #openbtn {
    padding: 8px;
}

#ruler-btn-inner {
    padding: 8px;
} */

.gmaps-custom-btn {
    padding: 8px;
}

/* .gmaps-custom-btn.clicked {
    transform: scale(0.85);
    box-shadow: 5px 4px 24px 3px rgba(0, 0, 0, 0.8);
} */

#ruler-btn-index.clicked,
#nav-btn-index.clicked,
#loc-search-btn-index.clicked {
    transform: scale(0.85);
    box-shadow: 5px 4px 24px 3px rgba(0, 0, 0, 0.8);
}

.rpm-infoWindow {
    border: 1.8px dotted;
    opacity: 0.7;
    background: lightgoldenrodyellow;
}

.loc-search-inputs {
    width: 24em;
    margin: 1em;
    height: 2.3em;
    padding: 1em 0.5em 1em 0.5em;
    font-size: 1.2em;
}

/* #ruler-btn-inner.clicked {
    color: white;
    background-color: black;
} */


/* your custom CSS \*/
@-moz-keyframes pulsate {
    from {
        -moz-transform: scale(0.3);
        opacity: 1.0;
    }
    95% {
        -moz-transform: scale(1.3);
        opacity: 0;
    }
    to {
        -moz-transform: scale(0.3);
        opacity: 0;
    }
}

@-webkit-keyframes pulsate {
    from {
        -webkit-transform: scale(0.3);
        opacity: 1.0;
    }
    95% {
        -webkit-transform: scale(1.3);
        opacity: 0;
    }
    to {
        -webkit-transform: scale(0.3);
        opacity: 0;
    }
}

/* get the container that's just outside the marker image, which just happens to have our Marker title in it */
/* .pulsingMarker { */
#map_index div[title="pulsingMarker"] {
    -moz-animation: pulsate 1.5s ease-in-out infinite;
    -webkit-animation: pulsate 1.5s ease-in-out infinite;
    /* border:1pt solid #fff; */

    /* make a circle */
    -moz-border-radius:100px;
    -webkit-border-radius:100px;
    border-radius:100px;

    /* multiply the shadows, inside and outside the circle */
    -moz-box-shadow:inset 0 0 5px #ff0000, inset 0 0 5px #ff0000, inset 0 0 5px #ff0000, 0 0 5px #ff0000, 0 0 5px #ff0000, 0 0 5px #ff0000;
    -webkit-box-shadow:inset 0 0 5px #ff0000, inset 0 0 5px #ff0000, inset 0 0 5px #ff0000, 0 0 5px #ff0000, 0 0 5px #ff0000, 0 0 5px #ff0000;
    box-shadow:inset 0 0 5px #ff0000, inset 0 0 5px #ff0000, inset 0 0 5px #ff0000, 0 0 5px #ff0000, 0 0 5px #ff0000, 0 0 5px #ff0000;

    /* set the ring's new dimension and re-center it */
    height:100px!important;
    margin:-34.2px 0 0 -34.2px;
    width:100px!important;
}

/* .pulsingMarker { */
#map_index div[title="pulsingMarkerTriangle"] {
    -moz-animation: pulsate 1.5s ease-in-out infinite;
    -webkit-animation: pulsate 1.5s ease-in-out infinite;
    /* border:1pt solid #fff; */

    /* make a circle */
    -moz-border-radius:100px;
    -webkit-border-radius:100px;
    border-radius:100px;

    /* multiply the shadows, inside and outside the circle */
    -moz-box-shadow:inset 0 0 5px #ff0000, inset 0 0 5px #ff0000, inset 0 0 5px #ff0000, 0 0 5px #ff0000, 0 0 5px #ff0000, 0 0 5px #ff0000;
    -webkit-box-shadow:inset 0 0 5px #ff0000, inset 0 0 5px #ff0000, inset 0 0 5px #ff0000, 0 0 5px #ff0000, 0 0 5px #ff0000, 0 0 5px #ff0000;
    box-shadow:inset 0 0 5px #ff0000, inset 0 0 5px #ff0000, inset 0 0 5px #ff0000, 0 0 5px #ff0000, 0 0 5px #ff0000, 0 0 5px #ff0000;

    /* set the ring's new dimension and re-center it */
    height:100px!important;
    margin:-40px 0 0 -40px;
    width:100px!important;
}